<template>
  <div class="page">
    <div class="problems">
      <h3>redis 数据类型</h3>
      <div>
        <template v-for="item in list" :key="item.label">
          <el-row class='mt-8'>
             <el-col :span='10'>
            <el-input type="text" v-model="item.key">
              <template #prepend>{{ item.label }}</template>
              <template #append>查询</template>
            </el-input>
          </el-col>
          <!-- <el-col :span='12'  :offset='2'>
            <el-input type="text" v-model="item.key">
              <template #prepend>{{ item.label }}</template>
              <template #append>查询</template>
            </el-input>
          </el-col> -->
          </el-row>

          <div class="mt-8">
            <el-input
              v-model="item.value"
              :autosize="{ minRows: 2, maxRows: 4 }"
              type="textarea"
              disabled
              resize='none'
            />
          </div>
        </template>
      </div>
    </div>
  </div>
</template>

<script lang='ts'>
import { defineComponent, ref } from '@vue/runtime-core'

export default defineComponent({
  name: 'Home',
  setup () {
    const list = ref([
      { label: 'string类型', key: '', value: '' },
      { label: 'hash类型', key: '', value: '' },
      { label: 'List类型', key: '', value: '' },
      { label: 'set类型', key: '', value: '' },
      { label: 'sorted set类型', key: '', value: '' },
    ])
    return {
      list,
    }
  },
})
</script>

<style scoped lang="less">
</style>
